<template>
	<view class="page">
		<form>
			<view v-for="item,index in cloumList" :key="index">
				<template v-if="item.type=='input'">
					<view class="title">
						<span class="commonName" v-if="!canSee">{{index+1}}.</span>
						<span class="commonName">{{item.name}}</span>
						<span class="commonValue" v-if="canSee"> : {{form[item.value]}}</span>
					</view>
					<view class="inputBox" style="margin-bottom: 10rpx;" v-if="!canSee">
						<input v-model="form[item.value]" class="infoBoxItemLeft" :placeholder="'请输入'+item.name" />
					</view>
				</template>
				<template v-if="item.type=='image'">
					<view class="title">
						<span class="commonName" v-if="!canSee">{{index+1}}.</span>
						<span class="commonName">{{item.name}}</span>
					</view>
					<photoUploadMuch v-model="form[item.value]" :index="index" @updateUpload="updateUpload" :canSee="canSee" />
				</template>
			</view>
			<divAdd :list="form.zdyList" :canSee="canSee" @update="updateDivList" />
			<view class="updateTimeClass" v-if="showTime">更新时间: {{form.updateTime?form.updateTime:form.createTime}}	</view>
			<view class="updateTimeClass" v-if="showTime">创建人: {{form.nickName}}
			</view>
			<bottomButton v-if="!canSee" :isFixed="false" @onPress="save" value="保存" />

		</form>
	</view>
</template>

<script>
	import photoUploadMuch from "@/components/photoUploadMuch.vue"
	import bottomButton from "@/components/bottomButton.vue"
	import divAdd from "@/components/divAdd.vue"
	import {
		addDoc,
		editDoc,
		finishMission
	} from "../../api/byfz"
	import PlaneInfo from "../../utils/planeInfoStorage"
	export default {
		components: {
			photoUploadMuch,
			bottomButton,
			divAdd
		},
		data() {
			return {
				cloumList: [{
						name: '客户名称',
						value: 'key1',
						type: 'input'
					},
					{
						name: '款式名称',
						value: 'key2',
						type: 'input'
					}
				],
				notes: '',
				data: {},
				form: {
					tableName: 'shengchan',
					zdyList: []
				},
				type: 'add'
			}
		},
		computed: {
			canSee() {
				return this.type == 'see'
			},
			showTime() {
				return this.type == 'edit' || this.type == 'see'
			}
		},
		onLoad() {
			let formData = uni.getStorageSync('formData')
			if (formData && formData.type) {
				this.type = formData.type
				if (this.type == 'see' || this.type == 'edit') {
					this.form = formData.form
					this.form.zdyList = formData.form.key1Ext ? JSON.parse(formData.form.key1Ext) : []
				}
			}
			console.log("formData==", formData);
			if(this.type == 'see'){
				uni.setNavigationBarTitle({
					title:'查看生产记录'
				})
			}else if(this.type == 'edit'){
				uni.setNavigationBarTitle({
					title:'修改生产记录'
				})
			}
			// this.data = uni.getStorageSync('searchDetail')
		},
		methods: {
			updateDivList(list) {
				this.form.zdyList = list;
			},
			updateUpload(url, index) {
				this.form[this.cloumList[index].value] = url;
			},
			async save() {
				this.form.key1Ext = JSON.stringify(this.form.zdyList)
				if (this.type == 'add') {
					await addDoc(this.form)
				}
				if (this.type == 'edit') {
					await editDoc(this.form)
				}
				uni.showToast({
					title: '操作成功!',
					icon: 'success'
				})
				// PlaneInfo.clearPlaneInfo()
				setTimeout(() => {
					uni.switchTab({
						url: '/pages/index/index',
						success: function(e) {
							uni.$emit('refreshIndex') // 执行这个事件代码
						},
					});
				}, 200)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		font-size: 27rpx;
		font-family: Adobe Heiti Std;
		color: #393939;
		line-height: 32rpx;
		overflow-y: auto;
		overflow-x: hidden;
	}

	.title {
		padding-left: 40rpx;
		padding-right: 40rpx;
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		display: flex;
		align-items: center;
	}

	.icon {
		width: 13rpx;
		height: 13rpx;
		font-size: 32rpx;
		font-family: Adobe Heiti Std;
		margin-left: 8rpx;
	}

	.editBwBox {
		width: calc(100% - 164rpx);
		background: #FFFFFF;
		border-radius: 13rpx 13rpx 13rpx 13rpx;
		opacity: 1;
		border: 1rpx solid #EEEEEE;
		margin-left: 40rpx;
		margin-right: 40rpx;
		padding-left: 42rpx;
		padding-right: 42rpx;
		padding-top: 36rpx;
		padding-bottom: 36rpx;
		margin-bottom: 30rpx;

		.editBwBoxTop {
			display: flex;
			justify-content: space-between;

			.editBwBoxIcon {
				width: 26rpx;
				height: 28rpx;
				opacity: 1;
			}
		}

		.editBwBoxArea {
			margin-top: 20rpx;
			height: 237rpx;
		}
	}

	.inputBox {
		width: calc(100% - 164rpx);
		background: #FFFFFF;
		border-radius: 13rpx 13rpx 13rpx 13rpx;
		opacity: 1;
		border: 1rpx solid #EEEEEE;
		margin-left: 40rpx;
		margin-right: 40rpx;
		padding-left: 20rpx;
		padding-right: 42rpx;
		padding-top: 10rpx;
		padding-bottom: 10rpx;
		margin-bottom: 30rpx;
		font-size: 10rpx;

		.infoBoxItemLeft {
			font-size: 23rpx;
		}
	}
</style>